<template>
  <div>
    <MBX Biao="商品管理" Biao1="参数列表"></MBX>
    <el-card class="mt">
      <el-alert title="只允许为三级分类设置参数" type="warning" show-icon> </el-alert>

    <div class="mt">
        <span class="demonstration">选择商品分类：</span>
        <el-cascader
          v-model="value"
          :options="addOptions"
          :props="addProps"
          @change="handleChange"
        ></el-cascader>
    </div>  

    <el-tabs class="mt" v-model="activeName" @tab-click="handleClick">
      <el-tab-pane label="动态参数" name="first">用户管理</el-tab-pane>
      <el-tab-pane label="静态参数" name="second">配置管理</el-tab-pane>
    </el-tabs>
    </el-card>
  </div>
</template>

<script>
import { getCatel } from "@/http/api";
export default {
    data(){
        return{
          value:[],
          addOptions:[],//获取商品分类数据数组
          addProps:{
              expandTrigger:'hover',
              label:'cat_name',
              value:'cat_id',
              children:'children'
          },
          activeName: 'second'
        }
    },
    created(){
      this.getCart()
    },
    methods:{
        async getCart(){
          const res= await getCatel()
          console.log('分类参数数据获取',res);
          this.addOptions=res
        },
        handleChange(){
          console.log('选择商品分类');
        },
        handleClick(tab, event) {
        console.log(tab, event);
      }
    }
};
</script>

<style scoped></style>
